import { Descriptions } from 'antd'
import { useEffect, useState } from 'react'

const rawList = [
  {
    label: '国民经济分类',
    key: 'neaInd',
    showExport: true,
    children: []
  },
  {
    label: '战略新兴产业分类',
    key: 'strategicInd',
    showExport: true,
    children: []
  },
  {
    label: '火石产业分类',
    key: 'hsInd',
    showExport: true,
    children: []
  }
]

const IndustrialClassification = (props: any) => {
  const { data } = props
  const [itemList, setItemList]: any = useState(rawList)
  useEffect(() => {
    setItemList(() => {
      const arr = [
        {
          label: '国民经济分类',
          key: 'neaInd',
          showExport: true,
          children: []
        },
        {
          label: '战略新兴产业分类',
          key: 'strategicInd',
          showExport: true,
          children: []
        },
        {
          label: '火石产业分类',
          key: 'hsInd',
          showExport: true,
          children: []
        }
      ]
      return arr.filter((item: any) => {
        if (data[item.key] !== null) {
          item.children = data[item.key].join(' ；')
          return true
        }
        return false
      })
    })
  }, [data])

  return (
    <div id="产业分类">
      <Descriptions size={'middle'} column={1} bordered items={itemList}></Descriptions>
    </div>
  )
}
export default IndustrialClassification
